<template>
  <div class="container">
    <list-view :list="list">
      <template #title="{ row }"> ListView{{ row.title }} </template>
    </list-view>
  </div>
</template>

<script>
import ListView from '@/components/listView/ListView'

export default {
  name: 'List',
  data() {
    return {
      list: [
        {
          title: '正坑水库1',
          attr1: '正坑水库1',
          attr2: '正坑水库1',
          attr3: '正坑水库1'
        },
        {
          title: '正坑水库2',
          attr1: '正坑水库2',
          attr2: '正坑水库2',
          attr3: '正坑水库2'
        },
        {
          title: '正坑水库3',
          attr1: '正坑水库3',
          attr2: '正坑水库3',
          attr3: '正坑水库3'
        },
        {
          title: '正坑水库4',
          attr1: '正坑水库4',
          attr2: '正坑水库4',
          attr3: '正坑水库4'
        },
        {
          title: '正坑水库5',
          attr1: '正坑水库5',
          attr2: '正坑水库5',
          attr3: '正坑水库5'
        },
        {
          title: '正坑水库6',
          attr1: '正坑水库6',
          attr2: '正坑水库6',
          attr3: '正坑水库6'
        },
        {
          title: '正坑水库7',
          attr1: '正坑水库7',
          attr2: '正坑水库7',
          attr3: '正坑水库7'
        },
        {
          title: '正坑水库8',
          attr1: '正坑水库8',
          attr2: '正坑水库8',
          attr3: '正坑水库8'
        },
        {
          title: '正坑水库9',
          attr1: '正坑水库9',
          attr2: '正坑水库9',
          attr3: '正坑水库9'
        },
        {
          title: '正坑水库10',
          attr1: '正坑水库10',
          attr2: '正坑水库10',
          attr3: '正坑水库10'
        }
      ]
    }
  },
  components: {
    ListView
  }
}
</script>
<style lang="scss" scoped>
.container {
  background-image: radial-gradient(50% 95%, #003871 50%, #002a52 95%);
  box-sizing: border-box;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
</style>
